import React, { useContext, useState, useEffect } from 'react'
import VoteMain from './Main'
import VoteFooter from './Footer'
import './vote.less'
import ThemeContext from '../../ThemeContext'

function Vote(props) {
  let [num, setNum] = useState(0)

  const { store } = useContext(ThemeContext)
  const { oppNum, supNum } = store.getState().vote

  let update = function update() {
    setNum(num + 1)
  }

  useEffect(() => {
    let unsubscribe = store.subscribe(() => {
      console.log('updater!')
      update()
    })

    return () => {
      unsubscribe()
    }
  }, [num])

  return <div id='vote'>
    <div>总人数:  {supNum + oppNum}</div>
    <VoteMain></VoteMain>
    <VoteFooter></VoteFooter>
  </div>
}

export default Vote